import 'package:base_flutter/base_flutter.dart';
import 'package:fan_da_app/res/drawables.dart';
import 'package:fan_da_app/utils/app_ext.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_svg/flutter_svg.dart';

import '../view_model/create_circle_view_model.dart';

class CreateCirclePage extends BaseStatefulMvvmWidget{
  @override
  State<StatefulWidget> createState() => _CreateCircleState();

}

class _CreateCircleState extends BaseMvvmState<CreateCircleViewModel,CreateCirclePage>{
  @override
  Widget? buildLoadingContentView() {
    return Stack(
      clipBehavior: Clip.none,
      children: [
        Container(width: double.infinity,),
        Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            SizedBox(height: 30,),
            Text('创 建 圈 子',style: TextStyle(
              color: Colors.black,fontSize: 22,fontWeight: FontWeight.bold,
              fontFamily: alimama
            ),),
            SizedBox(height: 20,),

            CommonInput(hintText: '请输入圈子名称',border: InputBorder.none,padding: EdgeInsets.zero,
            autoFocus: true,
            needClear: true,
            clearWidget: Icon(Icons.clear,size: 18,),
            isDense: true,).addToContainer(
              margin: EdgeInsets.symmetric(horizontal: 20),
              decoration: BoxDecoration(
                color: Colors.grey[200],
                borderRadius: 20.borderRadius,
                border: Border.all(color: Colors.grey,width: 1)
              ),
              padding: EdgeInsets.symmetric(horizontal: 20,vertical: 10)
            ),

            SizedBox(height: 20,),

            Row(
              children: [
                SizedBox(width: 20,),
                TextButton(onPressed: (){
                  Go().pop();
                }, child: Text('取 消',style: TextStyle(color: Colors.grey,fontSize: 16,fontFamily: alimama),),
                style: ButtonStyle(
                  shape: MaterialStateProperty.all(StadiumBorder(side: BorderSide(color: Colors.grey)))
                ),).setWeight(1),
                SizedBox(width: 20,),
                TextButton(onPressed: (){}, child: Text('确 定',style: TextStyle(
                  color: Colors.white,
                  fontSize: 16,fontFamily: alimama
                ),),style: ButtonStyle(
                  backgroundColor: MaterialStateProperty.all(mainColor),
                  shape: MaterialStateProperty.all(StadiumBorder())
                ),).setWeight(2),
                SizedBox(width: 20,),
              ],
            ),
            SizedBox(height: 10,)
          ],
        ).addToContainer(decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: 20.borderRadius
        ) ).setLocation(top: 20,left: 0,right: 0),
        SvgPicture.asset(image_cat,width: 200,).setLocation(left: -20,top: -45)
      ],
    ).addToContainer(width: context.querySize.width-32,height: 200);
  }

  @override
  Widget buildRootView(BuildContext context, Widget loadingContentWidget) {
   return loadingContentWidget;
  }

  @override
  CreateCircleViewModel createViewModel() {
    return CreateCircleViewModel(context);
  }

  @override
  void onRetryClick() {
  }

}